
main{
	height: 480px;
	
		.swiper {
			width: 100%;
			height: 480px;
			
		  }
	
		  .swiper-slide {
			text-align: center;
			font-size: 18px;
			background: #fff;
	
			/* Center slide text vertically */
			display: -webkit-box;
			display: -ms-flexbox;
			display: -webkit-flex;
			display: flex;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			-webkit-justify-content: center;
			justify-content: center;
			-webkit-box-align: center;
			-ms-flex-align: center;
			-webkit-align-items: center;
			align-items: center;
		  }
	
		  .swiper-slide img {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
		  }
		  .swiper-container-horizontal>.swiper-pagination-bullets{
			  bottom: 48px !important; 
		  }
		  .swiper-button-next{
			  color: #5F5F5F !important;
			  top:60% !important;
		  }
		  .swiper-button-prev{
			color: #5F5F5F !important;
			top:60% !important;
		  }
		
		
	}
	.brand{
		width: 100%;
		height: 171px;
		margin-top: 24px;
		div{
			width: 1191px;
			height: 100%;
			margin: 0 auto;
			overflow: hidden;
			
			span{
				padding-bottom: 2px;
				font-size: 16px;
				color: #999;
				
			}
			.brand-box{
				height: 171px;
				width: 100%;
				border-top: 1px solid #EEEEEE;
				display: flex;
				justify-content: space-around;
				div{
					margin-top: 22px;
					display: flex;
					justify-content: space-around;
				}
				div	img:nth-child(1){
					width: 169px;
					height: 34px;
				}
				img:nth-child(2){
					width: 100px;
					height: 31px;
				}
				img:nth-child(3){
					width: 25px;
					height: 48px;
				}
				img:nth-child(4){
					width: 157px;
					height: 39px;
				}
				img:nth-child(5){
					width: 118px;
					height: 26px;
				}
			}
		}
	}
	.recommend{
		width: 100%;
		height: 1617px;
		.recommend-box{
			width: 1191px;
			height: 100%;
			margin: 0 auto;
			span{
				font-size: 28px;
				color: #767676;
				margin-left: 539px;
			}
			div{
				width: 1191px;
				height: 38px;
				border-top: 1px solid #EEEEEE;
			}
			.bbox{
				width: 1191px;
				height: 1541px;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
			}
		}
	}
	.sunscreen{
		width: 100%;
		min-height: 807px;
		margin-top: 30px;
		// background-color: orange;
		.sunscreen-box{
			width: 1191px;
			min-height: 807px;
			// border: 1px solid;
			margin: 0 auto;
			span{
				font-size: 20px;
				color: #333333;
				display: inline-block;
				
				padding-left: 5px;
			}
			.suntop{

				width: 1140px;
				height: 210px;
				
				margin-top: 15px;
				display: flex;
				justify-content: space-between;
			}
		}
		.sunbotm{
			width: 1140px;
			min-height: 556px;
			// border: 1px solid;
			// display: flex;
			// justify-content: space-around;
			// flex-wrap: wrap;
			// align-items: center;
			// dl{
			// 	width: 25%;
			// 	cursor: pointer;
			// }
			// dl dt{
			// 	text-align: center;
			// }
			// dl dd:nth-child(2){
			// 	margin-top: 16px;
			// 	font-size: 13px;
			// 	padding-left: 33px;
			// }
			// dl dd:nth-child(2):hover{
			// 	color: #777777;
			// }
			// dl dd:nth-child(3){
			// 	font-size: 13px;
			// 	padding-left: 33px;
			// 	span{
			// 		padding-left: 122px;
			// 		color: #FDA33E !important;
			// 	}
			// }
			.ul1{
				width: 1191px;
				min-height: 300px;
				margin: 20px auto;
				overflow: hidden;
				// border: 1px solid;
			}
			.ul1 li{
				list-style: none;
				width: 236px;
				height: 304px;
				background-color: #fff;
				float: left;
				margin: 20px;
				padding: 15px;
				box-sizing: border-box;
			}
			.ul1 li .pic{
				height: 180px;
				position: relative;
			}
			.ul1 li .pic img{
				width: 160px;
				height: 160px;
				position: absolute;
				left: 0;
				right: 0;
				top: 0;
				bottom: 0;
				margin: auto;
			}
			.ul1 li p{
				font-size: 14px;
				text-align: center;
				line-height: 26px;
			}
			.ul1 li p.price{
				color: #ff6700;
			}
			.ul1 li button{
				color: white;
				display: block;
				margin: 1px auto;
				cursor: pointer;
				background-color: #E31939;
				border: 1px solid #E31939;
			}
			.count{
				width: 100px;
				height: 120px;
				background-color: orange;
				position: absolute;
				right: 0;
				top: 300px;
				font-size: 14px;
				text-align: center;
				line-height: 100px;
			}
			.count span{
				color: red;
				font-weight: bold;
				margin: 2px;
			}
			.hide{
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				overflow: hidden;
			}
		}
	}


